<template>
	<view class="u-page">
		<div class="cards">
			<!-- 可滚动的客户列表 -->
			<scroll-view scroll-y="true" style="flex: 1; margin-top: 10px;">
				<view class="cards">
				<view 
					class="card" 
					v-for="item in dtReport" 
					:key="item.HNYY_PRICE_PRODUCE_NO"
					style="display: flex; align-items: center; border: 1px solid #eee; margin-bottom: 10px; padding: 10px; border-radius: 8px;"
				>
					<!-- 左侧信息 -->
					<view style="margin-left: 10px; flex: 1;">
						<div>冲差单号：{{item.HNYY_PRICE_PRODUCE_NO}}</div>
						<div>客户名称：{{item.CLIENT_NAME}}</div>
						<div>制单人：{{item.CREATER_NAME}}</div>
						<div>制单日期：{{formatDate(item.CREATE_DATE)}}</div>
						<div>库存证明上传状态：{{item.OP_FLAG_STATUS}}</div>
						<div>库存证明张数：{{item.FILE_NUM}}</div>
						<div>冲差状态：{{item.PRODUCE_FLAG_STATUS}}</div>
				        <div>冲差金额：{{item.WC_AMOUNT}}</div>
						<div>已冲金额：{{item.YC_AMOUNT}}</div>
						
					</view>

					<!-- 右侧按钮 -->
					<view style="display: flex; flex-direction: column; gap: 6px;">
						<u-button size="small" type="primary" @click.stop="handleClickDt(item)">详情</u-button>
						<u-button size="small" type="success" @click.stop="handleUpload(item)">上传</u-button>
						<u-button v-if="item.OP_FLAG_STATUS == '已传'" size="small" type="warning" @click.stop="handleView(item)">查看</u-button>
					</view>
				</view>
				</view>
			</scroll-view>
		</div>


		<!-- 悬浮搜索 -->
		<view class="fixed-search" @click="handleRightClick">
			<u-icon name="search" color="#fff" size="28"></u-icon>
		</view>
		<!-- 搜索弹窗 -->
		<u-popup :show="show" closeable @close="handleClose" @open="handleOpen" mode="right">
			
			<view class="popup-card">
				<u--form labelPosition="top" :model="model1" :rules="rules" ref="form1">
					<u-form-item label="客户ID" prop="userInfo.ClientId" borderBottom ref="ClientId"
						@click="showKh = true;hideKeyboard()">
						<u--input v-model="model1.userInfo.ClientId" placeholder="请点击选择..." disabled
							disabledColor="#ffffff" border="none"></u--input>
					</u-form-item>
					<u-form-item label="客户名称" prop="userInfo.ClientName" borderBottom ref="ClientId"
						@click="showKh = true;hideKeyboard()">
						<u--input v-model="model1.userInfo.ClientName" placeholder="请点击选择..." disabled
							disabledColor="#ffffff" border="none"></u--input>
					</u-form-item>
					<u-form-item label="供应商名称" prop="userInfo.lsVenderName" borderBottom ref="lsVenderName">
						<u--input v-model="model1.userInfo.lsVenderName" placeholder="请输入..." border="none"></u--input>
					</u-form-item>
					<u-form-item label="商品信息" prop="userInfo.goodsCode" borderBottom ref="goodsCode">
						<u--input v-model="model1.userInfo.goodsCode" placeholder="请输入..." border="none"></u--input>
					</u-form-item>
					<!-- 是否上传 -->
					<u-form-item label="是否上传" prop="userInfo.lsIsUpload" borderBottom ref="lsIsUpload"
					@click="showSC = true; hideKeyboard()">
						<u--input v-model="model1.userInfo.lsIsUpload" placeholder="请点击选择..." readonly disabledColor="#ffffff" border="none"></u--input>
					</u-form-item>

					<u-form-item label="制单开始日期" prop="userInfo.StartDate" borderBottom ref="item1"
						@click="showStartDate = true; hideKeyboard()">
						<u--input v-model="model1.userInfo.StartDate" placeholder="请点击选择..." disabled
							disabledColor="#ffffff" border="none">
						</u--input>
					</u-form-item>
					<u-form-item label="制单结束日期" prop="userInfo.EndDate" borderBottom ref="item1"
						@click="showDate = true; hideKeyboard()">
						<u--input v-model="model1.userInfo.EndDate" placeholder="请点击选择..." disabled
							disabledColor="#ffffff" border="none" @click="showDate = true">
						</u--input>
					</u-form-item>
				</u--form>
			</view>
			<u-datetime-picker title="制单开始日期" :show="showStartDate" :value="Startdate" mode="date" closeOnClickOverlay
				@cancel="handleCancelDates" ref="datetimePicker" @close="handleCancelDates" @confirm="handleConfirms">
			</u-datetime-picker>
			<u-datetime-picker title="制单结束日期" :show="showDate" :value="date" mode="date" closeOnClickOverlay
				@cancel="handleCancelDate" ref="datetimePicker" @close="handleCancelDate" @confirm="handleConfirm">
			</u-datetime-picker>
			<!-- 上传 -->
                <u-picker 
                    title="是否上传" 
                    :show="showSC" 
                    ref="uPicker" 
                    :columns="scList" 
                    keyName="label"
                    @close="handleCancelSc" 
                    @cancel="handleCancelSc"
                    @confirm="handleConfirmSc"
                    @change="changeHandler2"
                />
			<u-popup :show="showKh" mode="center" :round="10" closeable @close="handleCloseKh">
				<view class="kh-card">
					<div class="search">
						<u-search placeholder="请输入..." :showAction="false" v-model="keyword" @search="handleSearchKh">
						</u-search>
					</div>
					<div class="cards">
						<div class="card" v-for="item in khList" :key="item.COM_PARTY_ID" @click="handleClickKh(item)">
							<div>客户ID：{{item.COM_PARTY_ID}}</div>
							<div>客户名称：{{item.PARTY_NAME}}</div>
							<div>客户代码：{{item.PARTY_OPCODE}}</div>
							<div>拼音：{{item.SPELL}}</div>
						</div>
					</div>
				</view>
			</u-popup>
			<!-- 底部固定按钮 -->
			<view class="btn-group">
			<u-button
				:plain="true"
				text="重置"
				size="small"
				:hairline="true"
				@click="handleReset"
			></u-button>
			<u-button type="primary" text="查询" size="small" @click="handleSubmit"></u-button>
			</view>
		</u-popup>

		 <!-- 成明细显示 -->
		<u-popup :show="showModal" closeable mode="right" @close="handleCancelPx">
			<view class="drawer">
				<!-- 滚动内容区域 -->
			<scroll-view scroll-y="true" style="height: calc(100vh - 60rpx);">
				<view class="cards">
				<view 
					class="card" 
					v-for="item in detailList" 
					:key="item.HNYY_PRICE_PRODUCE_LINES_ID"
					style="display: flex; align-items: center; border: 1px solid #eee; margin-bottom: 10px; padding: 10px; border-radius: 8px;"
				>
					
					<!-- 左侧信息 -->
					<view style="margin-left: 10px; flex: 1;">
						<div>订单号码：{{item.ORDER_NO}}</div>
						<div>发票号码：{{item.INVOICE_NO}}</div>
						<div>订单类型：{{item.ORDER_TYPE}}</div>
						<div>销售代表：{{item.SALER_NAME}}</div>
						<div>销售部门：{{item.ORG_NAME}}</div>
						<div>政策ID：{{item.HNYY_PRICE_LINKAGE_LIST_ID}}</div>
						<div>截止日期：{{formatDate(item.COLLECT_END_DATE)}}</div>
						<div>联动前价格：{{item.SOURCE_PRICE}}</div>
						<div>联动后价格：{{item.NOW_PRICE}}</div>
						<div>冲差数量：{{item.ACT_QTY}}</div>
						<div>应冲金额：{{item.AMOUNT}}</div>	
						<div>批号：{{item.LOT_NO}}</div>	
						<div>生产日期：{{ formatDate(item.PRODUCE_DATE) }}</div>
						<div>有效期：{{formatDate(item.EXPIRE_DATE)}}</div>		
						<div>商品编码：{{item.GOODS_OPCODE}}</div>		
						<div>商品名称：{{item.GOODS_NAME}}</div>		
						<div>商品规格：{{item.GOODS_DESC}}</div>		
						<div>生产厂家：{{item.PRODUCT_LOCATION}}</div>		
					</view>
				</view>
				</view>
			</scroll-view>
			</view>
		</u-popup>

	</view>
</template>

<script>
	import store from "@/store";
	import dayjs from "dayjs"
	import _ from "lodash"
	import {
		searchShangchuan,
		getSaleDepartment,
		uploadMingxi,
		uploadImage,
		viewImage,
		saveImage,
		searchKh
	} from "@/api";
	export default {
		filters: {
			filterTimes(val) {
				if (val) {
					return dayjs(val).format("YYYY-MM-DD")
				} else {
					return val
				}
			},
			filterOrgName(val) {
				if (val) {
					return val.substr(0, 3)
				} else {
					return ''
				}
			}
		},
		data() {
			return {
				subAmount: Number(0).toFixed(2),
				writeAmount: Number(0).toFixed(2),
				showModal: false,
				detailList: [],
				title: "提示",
				content: "是否确认提交?",
				page: {
					current: 1,
					size: 10,
					total: 0
				},
				showStartDate: false,
				showSC: false,
				khList: [],
				scList: [
                            [
                                { label: '已上传', value: 'TRUE' },
                                { label: '未上传', value: 'FALSE' }
                            ]
                    ],
                selectedKh: [], // 保存选中的客户 ID
				keyword: "",
				showKh: false,
				showDepartment: false,
				showDate: false,
				date: Number(new Date()),
				Startdate: Number(new Date()),
				status_height: 44,
				show: false,
				NowLotId: "",
				model1: {
					userInfo: {
						lsVenderId:"",
						ClientId: "",
						ClientCode: "",
						lsVenderName:"",
						StartDate: dayjs().format('YYYY-MM-DD'),
						EndDate: dayjs().format('YYYY-MM-DD'),
						goodsCode: "",
						lsIsUpload: "",
						

					},
				},
				formData: {
					ls_vender_id:'',
					ls_client_id: '',
					ls_client_name: '',
					ls_vender_name: '',
					ls_start_date: '',
					ls_end_date: '',
					ls_is_upload: '',
					ls_goods_info: '',
					ls_inv_owner: '',
					ls_client_attr:'',
					ls_user_sets_id:''
				},
				shenCheng: {
					ls_client_id: '',
					ls_vender_id: '',
					ls_inv_owner:'',
					ls_user:'',
					ssc_order_lines_lots_id:''
				},

				dtReport: [], // 政策查询结果
				rules: {
					'userInfo.ClientId': {
						type: 'string',
						required: true,
						message: '请选择客户',
						trigger: ['blur', 'change']
					},
				},
				saleList: [
					[]
				],
				dtReport: [
					
				],
				dtReport1: [
					
				],
				gridview1: [],
				gridview2: []
			}
		},
		computed: {
			remainAmount() {
				return Number(this.subAmount - this.writeAmount).toFixed(2)
			}
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form1.setRules(this.rules)
		},
		onLoad() {
			this.status_height = store.state.status_height
			// 请求销售部门和编码
			this.fetchSaleDepartment()
		},
		methods: {	
			 async handleView(item) {
				try {
					const params = {
						typename: 'linkage_list_goods',
						invoice_id: item.HNYY_PRICE_PRODUCE_ID
				};

				const res = await viewImage(params); 
				if(!res || (res.State !== 1 && res.state !== 1)) {
					uni.showToast({ title: res.Msg || '请先上传图片', icon: 'none' });
					return;
				}
				// 兼容不同返回结构
				const list = (res && res.Data) || (res && res.data && res.data.Data) || [];

				if (!Array.isArray(list) || list.length === 0) {
					uni.showToast({ title: '没有图片', icon: 'none' });
					return;
				}
				const baseUrl = 'https://wx.sphhn.com:83/Web/';

				const urls = list.map(i => {
					const href = i.HREF
					return /^https?:\/\//.test(href) ? href : baseUrl + href;
				});
				urls.forEach(url => {
					console.log(url);
				});

				uni.previewImage({
					urls,
					current: urls[0]
				});

				} catch (err) {
				console.error('获取或预览图片失败', err);
				uni.showToast({ title: '获取图片失败', icon: 'none' });
				}
			},
			formatDate(value) {
				if (!value) return ''
				return value.split('T')[0]
			},
            toggleKh(id) {
                if (this.selectedKh.includes(id)) {
                this.selectedKh = this.selectedKh.filter(i => i !== id)
                } else {
                this.selectedKh.push(id)
                }
            },
			//重置
			handleReset() {
				this.model1.userInfo = {
					lsVenderId:"",
					ClientId: "",
					ClientCode: "",
					lsVenderName:"",
					StartDate: dayjs().format('YYYY-MM-DD'),
					EndDate: dayjs().format('YYYY-MM-DD'),
					goodsCode: "",
					lsIsUpload: "",
				}
				this.dtReport = []
			},
			handleConfirmDepartment(val) {
				const row = val.value[0]
				this.model1.userInfo.SaleOrg_name = row.SALE_ORG_NAME
				this.model1.userInfo.SaleOrg = row.SALE_ORG
				this.model1.userInfo.SHORT_CODE = row.POSTCODE
				this.handleCancelDepartment()
			},
			handleConfirmSc(val) {
                const row = val.value[0]
				//console.log('登记情况选择:', row)
                //this.formData.ls_dj_flag = row.value 
                this.model1.userInfo.lsIsUpload = row.label  // 显示文本
				this.formData.lsIsUpload = row.value         // 实际值
				this.handleCancelSc()
			},
			handleCancelSc() {
			    this.showSC = false
			},
			handleCancelDates() {
				this.showStartDate = false
			},
			handleConfirms(e) {
				this.showStartDate = false
				this.model1.userInfo.StartDate = dayjs(e.value).format('YYYY-MM-DD')
			},
			handleConfirm(e) {
				this.showDate = false
				this.model1.userInfo.EndDate = dayjs(e.value).format('YYYY-MM-DD')
			},
			handleClickKh(row) {
				this.showKh = false
				this.model1.userInfo.ClientCode = row.PARTY_OPCODE
				this.model1.userInfo.ClientId = row.COM_PARTY_ID
				this.model1.userInfo.ClientName = row.PARTY_NAME
			},
			// 搜索客户
			async handleSearchKh(val) {
				console.log('111',111)
				if (!_.trim(val)) {
					return uni.showToast({
						title: "请输入搜索关键词"
					})
				}
				uni.showLoading({
					title: "搜索中",
					mask: true
				})
				try {
					const userinfo = uni.getStorageSync('userinfo')
					const res = await searchKh(val, userinfo.USER_ID)
					if (res.State == 1) {
						this.khList = res.Data
					} else {
						uni.showToast({
							title: res.Msg,
							icon: "error"
						})
					}
				} catch (e) {
				} finally {
					uni.hideLoading()
				}
			},

			// 查询（上传查询）
			async handleSubmit(){
				try {
					uni.showLoading({
						title: '查询中...',
						mask: true
					})
						this.formData.ls_vender_id=this.model1.userInfo.lsVenderId||''
						this.formData.ls_client_id=this.model1.userInfo.ClientId||''
						this.formData.ls_client_name=this.model1.userInfo.ClientName||''
						this.formData.ls_vender_name=this.model1.userInfo.lsVenderName||''
						this.formData.ls_start_date=this.model1.userInfo.StartDate||''
						this.formData.ls_end_date=this.model1.userInfo.EndDate||''
						this.formData.ls_is_upload=this.model1.userInfo.lsIsUpload||''
						this.formData.ls_goods_info=this.model1.userInfo.goodsCode||''
						this.formData.ls_user_type = uni.getStorageSync('userinfo').USER_TYPE||''
						this.formData.ls_user_name= uni.getStorageSync('userinfo').USER_NAME||''
						this.formData.ls_inv_owner = uni.getStorageSync('userinfo').COM_PARTY_ID||''
						this.formData.ls_user_sets_id= uni.getStorageSync('userinfo').SETS_ID||''
						this.formData.ls_client_attr=''
						console.log('model1',this.formData)

						const res = await searchShangchuan(this.formData)
						console.log('res',res)

						if(res.State === 1){
							this.dtReport = res.Data  
							this.show = false         
						} else {
							uni.showToast({ title: res.Msg || '查询失败', icon: 'none' })
						}
				} catch (e) {
					console.error(e)
					uni.showToast({ title: '请求异常', icon: 'none' })
				} finally {
					uni.hideLoading()
				}
			},
			// 图片上传
			async handleUpload(item) {
				 uni.chooseImage({
					count: 1,
					success: (res) => {
						const filePath = res.tempFilePaths[0]
						console.log('filePath',filePath)
						const token = uni.getStorageSync('token');
						const userinfo = uni.getStorageSync('userinfo')
						uni.uploadFile({
							url: "https://wx.sphhn.com:83/api/chongcha/shangchuan/upload", 
							filePath: filePath,
							name: "Filedata", 
							formData: {
								org: userinfo.COM_PARTY_ID, 
								scan_type: "price_linkage_list" 
							},
							header: {
								"Authorization": userinfo.USER_ID + '|' + token
							},
							success: async (res) => {
								console.log("上传成功：", res)
								const result=JSON.parse(res.data)
								uni.showToast({ title: "上传成功", icon: "success" })
								const data={
									user_id:uni.getStorageSync('userinfo').SALER,
									inv:uni.getStorageSync('userinfo').COM_PARTY_ID,
									typename:'price_linkage_list',
									ls_invoice_id:item.HNYY_PRICE_PRODUCE_ID,
									ls_file_name:result.Data
								}
								console.log('data',data)
								const res1=await saveImage(data)
								console.log('res',res1)
								// 更新
								this.handleSubmit()
							},
							fail: (err) => {
								console.error("上传失败：", err)
								uni.showToast({ title: "上传失败", icon: "none" })
							}
						})
					}
					})
			},


			handleCancelPx() {
				this.showModal = false
			},
			async handleClickDt(row){
			  	this.showModal = true  // 打开弹窗
				console.log('row',row)
				this.NowLotId=row.HNYY_PRICE_PRODUCE_NO
				const res=await uploadMingxi({ls_invoice_id:row.HNYY_PRICE_PRODUCE_ID})
				this.detailList=res.Data.ds
				console.log('res',this.detailList)
			},
			handleCloseKh() {
				this.showKh = false
			},
			changeHandler(e) {
				const {
					columnIndex,
					index,
					// 微信小程序无法将picker实例传出来，只能通过ref操作
					picker = this.$refs.uPicker
				} = e
				const row = this.saleList[columnIndex][index]
				this.model1.userInfo.SaleOrg_name = row.SALE_ORG_NAME
				this.model1.userInfo.SaleOrg = row.SALE_ORG
				this.model1.userInfo.SHORT_CODE = row.POSTCODE
			},
			changeHandler2(e) {
                const {
                    columnIndex,
                    index,
                    // 微信小程序无法将picker实例传出来，只能通过ref操作
                    picker = this.$refs.uPicker
                } = e
                const row = this.scList[columnIndex][index]
				console.log('row',row)
			    this.model1.userInfo.lsIsUpload = row.label
                //this.model1.userInfo.ls_dj_flag = row.DJ_FLAG
            },
			async fetchSaleDepartment() {
				const userinfo = uni.getStorageSync('userinfo')
				const res = await getSaleDepartment(userinfo.COM_PARTY_ID)
				if (res.State == 1) {
					const {
						Data
					} = res
					this.saleList[0] = Data
				}
			},
			handleCancelDepartment() {
				this.showDepartment = false
			},
			handleCancelDate() {
				this.showDate = false
			},
			handleClose() {
				this.show = false
			},
			handleOpen() {

			},
			handleRightClick() {
				this.show = true
			},
			hideKeyboard() {
				uni.hideKeyboard()
			}
		}
	}
</script>

<style lang="scss">
	/* #ifndef APP-NVUE */
	page {
		background-color: $u-bg-color;
	}
	.popup-card {
		padding: 50rpx 32rpx;
		width: calc(100vw - 64rpx);
		height: calc(100vh - 100rpx);
		overflow-y: scroll;
	}

	.kh-card {
		padding: 20rpx 32rpx;
		width: calc(100vw - 64rpx);
		height: calc(100vh - 100rpx);
		overflow-y: scroll;

		.search {
			margin-top: 80rpx;
			margin-bottom: 50rpx;
		}

		.cards {
			.card {
				box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, .1);
				padding: 24rpx;
				border-radius: 8rpx;
				margin-bottom: 32rpx;

				div {
					font-size: 28rpx;
					line-height: 48rpx;
					color: #333333;
				}
			}
		}
	}

	.btn-group {
		position: sticky;
		bottom: 0;
		display: flex;
		justify-content: space-around;
		padding: 10px;
		background-color: #fff;
		z-index: 10;
	}
    .btn {
        position: fixed;
        bottom: 20rpx;
        left: 50%;
        transform: translateX(-50%);
        width: calc(100% - 64rpx);
        padding: 0 32rpx;
        z-index: 10;
    }

	.fixed-search {
		width: 80rpx;
		height: 80rpx;
		position: fixed;
		right: 8rpx;
		top: 50%;
		background-color: $u-primary;
		display: flex;
		align-items: center;
		justify-content: center;
		border-radius: 8rpx;
	}

	/deep/.u-form-item__body__left {
		width: 200rpx !important;
	}

	/deep/.u-form-item__body__left__content__label {
		font-size: 28rpx !important;
	}

	.panel {
		.content {
			display: grid;
			width: 100%;
			grid-template-columns: repeat(3, 1fr);
			grid-gap: 12rpx;

			.col {
				width: 100%;
				margin-bottom: 10rpx;
				display: flex;
				flex-direction: column;
				font-size: 24rpx;

				span {
					&:nth-child(2) {
						word-break: break-all;
						overflow: hidden;
						text-overflow: ellipsis;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}
				}
			}
		}
	}

	.u-input__content__field-wrapper input {
		font-size: 24rpx !important;
	}

	.col .u-input {
		padding: 0 !important;
		width: 160rpx !important;
	}

	.tool-page {
		padding: 0 36rpx;
		.remark {
			margin-bottom: 20rpx;
			display: flex;
			align-items: center;

			span {
				font-size: 28rpx;
			}

			/deep/.u-input {
				display: inline !important;
				background-color: #fff !important;
				max-width: 600rpx !important;
				padding: 6rpx 9rpx !important;
			}
		}

		.page {
			display: flex;
			align-items: center;
			margin-bottom: 20rpx;

			span {
				font-size: 28rpx;
			}

			/deep/.u-input {
				display: inline !important;
				background-color: #fff !important;
				max-width: 100rpx !important;
				padding: 6rpx 9rpx !important;
			}

			.search-btn {
				margin-left: 10rpx;
				font-size: 28rpx;
				background-color: $u-primary;
				padding: 12rpx 18rpx !important;
				color: #fff;
				border-radius: 8rpx;
				cursor: pointer;
			}
		}

		.remark {}
	}

	.search-price {
		position: fixed;
		width: 100%;
		padding-top: 30rpx;
		background-color: #fff;
		z-index: 50;
		top: 62rpx;
		ul {
			padding: 0 32rpx;
			li {
				display: flex;
				align-items: center;
				margin: 20rpx 0;

				span {
					font-size: 24rpx;
					margin-right: 20rpx;
				}

				/deep/.u-input {
					background-color: #eeeeef !important;
				}

			}
		}
	}

	.fixed-search {
		/deep/.u-icon__icon {
			font-size: 56rpx !important;
		}
	}

.cards {
			.card {
				box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, .1);
				padding: 24rpx;
				border-radius: 8rpx;
				margin-bottom: 32rpx;

				div {
					font-size: 28rpx;
					line-height: 48rpx;
					color: #333333;
				}
			}
		}
.popup-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}


.popup-body {
  flex: 1;
  overflow-y: auto;
  padding: 20rpx;
  padding-bottom: 120rpx; /* 预留按钮高度 */
}


.popup-footer {
  position: sticky;  /* 相对于容器底部固定 */
  bottom: 0;
  left: 0;
  width: 100%;
  background: #fff;
  border-top: 1px solid #eee;
  z-index: 10;
}

.confirm-btn {
  width: 100%;
  background-color: #2979ff;
  color: #fff;
  border-radius: 8rpx;
  height: 88rpx;
}


.drawer {
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vh;   /* 必须有固定高度 */
  background: #fff;
}

.drawer-scroll {
  flex: 1;         /* 关键：scroll-view 占满剩余空间 */
  overflow-y: auto;
}

.drawer-footer {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  border-top: 1px solid #eee;
  padding: 16rpx 20rpx calc(16rpx + env(safe-area-inset-bottom));
  padding-bottom: calc(16rpx + constant(safe-area-inset-bottom));   
  z-index: 10;
}

.detail-item {
  padding: 16rpx 0;
  border-bottom: 1px solid #eee;
//   display: flex;
  justify-content: space-between;
}
.label { font-size: 28rpx; color: #666; }
.value { 
	font-size: 31rpx; color: #333; 
	// text-align: right; 
}

/* 按钮 */
.confirm-btn {
  width: 100%;
  height: 88rpx;
  line-height: 88rpx;
  background-color: #2979ff;
  color: #fff;
  border-radius: 12rpx;
}


</style>
